Component({
  properties: {
    //属性值可以在组件使用时指定
    isCanDraw: {
      type: Boolean,
      value: false,
      observer(newVal, oldVal) {
        newVal && this.drawPic()
      }
    },
    code_img:{
      type:String,
      value:''
    },
    bg_img:{
      type:String,
      value:''
    },
    obj:{
      type:Object,
      value:{},
      require:true
    }
  },
  data: {
    isModal: false, //是否显示拒绝保存图片后的弹窗
    imgDraw: {}, //绘制图片的大对象
    sharePath: '', //生成的分享图
    visible: false
  },
  methods: {
    imgclick(e){
      console.log(e)
      let src=e.currentTarget.dataset.src;
      if(src){
        wx.previewImage({
          urls: [src],
        })
      }
    },
    handlePhotoSaved() {
      this.savePhoto(this.data.sharePath)
    },
    handleClose() {
      this.setData({
        visible: false
      })
    },
    drawPic() {
      // if(!this.data.code_img){
      //   wx.showToast({
      //     title: '没有二维码',
      //     icon:"none"
      //   })
      //   return false;
      // }
      if (this.data.sharePath) { //如果已经绘制过了本地保存有图片不需要重新绘制
        this.setData({
          visible: true
        })
        this.triggerEvent('initData') 
        return
      }
      wx.showLoading({
        title: '生成中'
      })
      let width = this.data.obj.width
      let height = this.data.obj.height
      let left = this.data.obj.left
      let bottom = this.data.obj.bottom
      let code_width =  this.data.obj.code_width?this.data.obj.code_width:'250px'
      let code_height =  this.data.obj.code_height?this.data.obj.code_height:'250px'
      if(!this.data.obj.width||!this.data.obj.height||!this.data.obj.left||!this.data.obj.bottom){
        wx.hideLoading({
          success(){
            wx.showToast({
              title: '参数缺失',
              icon:"none",
            })
          }
        })
        throw '参数缺失';
        return
      }
      this.setData({
        imgDraw: {
          width:width,
          height:height,
          background: this.data.bg_img,
          css:{
            position:'relative',
          },
          views: [
            {
              type: 'image',
              url: this.data.code_img||'../../../resources/ceshi_code.jpg',
              css: {
                bottom: bottom,
                left: left,
                width: code_width,
                height: code_height,
                borderRadius:this.data.obj.borderRadius,
                borderWidth:this.data.obj.borderWidth,
                borderColor:"#fff"
              },
            },
          ]
        }
      })
    },
    onImgErr(e) {
      wx.hideLoading()
      wx.showToast({
        title: '生成分享图失败，请刷新页面重试'
      })
    },
    onImgOK(e) {
      wx.hideLoading()
      this.setData({
        sharePath: e.detail.path,
        visible: true,
      })
      //通知外部绘制完成，重置isCanDraw为false
      this.triggerEvent('initData') 
    },
    preventDefault() { },
    // 保存图片
    savePhoto(path) {
      wx.showLoading({
        title: '正在保存...',
        mask: true
      })
      this.setData({
        isDrawImage: false
      })
      wx.saveImageToPhotosAlbum({
        filePath: path,
        success: (res) => {
          wx.showToast({
            title: '保存成功',
            icon: 'none'
          })
          setTimeout(() => {
            this.setData({
              visible: false
            })
          }, 300)
        },
        fail: (res) => {
          wx.getSetting({
            success: res => {
              let authSetting = res.authSetting
              if (!authSetting['scope.writePhotosAlbum']) {
                this.setData({
                  isModal: true
                })
              }
            }
          })
          setTimeout(() => {
            wx.hideLoading()
            this.setData({
              visible: false
            })
          }, 300)
        }
      })
    }
  },
 
})
